<template>
    <el-drawer title="编辑方案" :model-value="modelValue" :size="670" @closed="handleClose">
        <InputBaseInfo ref="formRef" :is-edit="true" :plan-id="planDetail.planId" />
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="handleClose">取消</el-button>
                <el-button :loading="loading" type="primary" @click="submit">确认</el-button>
            </span>
        </template>
    </el-drawer>
</template>

<script setup lang="ts">
import { ref, defineProps, defineEmits } from 'vue';
import { exportSelectedMap, exportKickedList, exportSelected } from '@/api/plan.ts';
import { downLoadCommon } from '@/utils/common';
import InputBaseInfo from './inputBaseInfo.vue';
import { ElMessage } from 'element-plus';

const formRef = ref(null);
const emits = defineEmits<{(e: 'update:modelValue', visible: boolean): void; (e: 'success'): void }>();
const type = ref(null);
const textarea = ref<object | null>(null);
const props = defineProps({
    modelValue: {
        type: Boolean,
        default: false,
    },
    planDetail: {
        type: Object,
        default: () => null,
    },
});
const handleClose = () => {
    emits('update:modelValue', false);
};

const handleExportSelected = async () => {
    const data = await exportSelected({ planId: props.planDetail.planId });
    downLoadCommon(data);
};

const handleExportSelectedMap = async () => {
    const data = await exportSelectedMap({ planId: props.planDetail.planId });
    downLoadCommon(data);
};

const handlExportKickedList = async () => {
    const data = await exportKickedList({ planId: props.planDetail.planId });
    downLoadCommon(data);
};

const loading = ref(false);
const submit = async () => {
    try {
        loading.value = true;
        await formRef.value.handleSubmit();
        loading.value = false;
        handleClose();
        ElMessage.success('提交成功！');
        emits('success');
    } finally {
        loading.value = false;
    }
};
</script>

<style lang="scss" scoped>
:deep(.el-form) {
    height: auto;
}

:v-deep .el-form {
    height: auto !important;
}
</style>
